﻿<phone:PhoneApplicationPage 
    x:Class="Tsina.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:Tsina"
    xmlns:tiltEffect="clr-namespace:ControlTiltEffect"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"    
    xmlns:unsupported="clr-namespace:Microsoft.Phone.Controls.Unsupported"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="728" 
    d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    tiltEffect:TiltEffect.IsTiltEnabled="True"
    shell:SystemTray.IsVisible="False">

    <phone:PhoneApplicationPage.Resources>
        <local:UserImageConverter x:Key="UserImageConverter" />
        <Style x:Key="CustomIndeterminateProgressBar" TargetType="ProgressBar">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <unsupported:RelativeAnimatingContentControl HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
                            <unsupported:RelativeAnimatingContentControl.Resources>
                                <ExponentialEase EasingMode="EaseOut" Exponent="1" x:Key="ProgressBarEaseOut"/>
                                <ExponentialEase EasingMode="EaseOut" Exponent="1" x:Key="ProgressBarEaseIn"/>
                            </unsupported:RelativeAnimatingContentControl.Resources>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Determinate"/>
                                    <VisualState x:Name="Indeterminate">
                                        <Storyboard RepeatBehavior="Forever" Duration="00:00:04.4">
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="IndeterminateRoot">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Visible</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DeterminateRoot">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Collapsed</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.0" Storyboard.TargetProperty="X" Storyboard.TargetName="R1TT">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.0" Value="0.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:00.5" Value="33.1" EasingFunction="{StaticResource ProgressBarEaseOut}"/>
                                                <LinearDoubleKeyFrame KeyTime="00:00:02.0" Value="66.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="100.1" EasingFunction="{StaticResource ProgressBarEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.2" Storyboard.TargetProperty="X" Storyboard.TargetName="R2TT">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.0" Value="0.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:00.5" Value="33.1" EasingFunction="{StaticResource ProgressBarEaseOut}"/>
                                                <LinearDoubleKeyFrame KeyTime="00:00:02.0" Value="66.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="100.1" EasingFunction="{StaticResource ProgressBarEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.4" Storyboard.TargetProperty="X" Storyboard.TargetName="R3TT">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.0" Value="0.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:00.5" Value="33.1" EasingFunction="{StaticResource ProgressBarEaseOut}"/>
                                                <LinearDoubleKeyFrame KeyTime="00:00:02.0" Value="66.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="100.1" EasingFunction="{StaticResource ProgressBarEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.6" Storyboard.TargetProperty="X" Storyboard.TargetName="R4TT">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.0" Value="0.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:00.5" Value="33.1" EasingFunction="{StaticResource ProgressBarEaseOut}"/>
                                                <LinearDoubleKeyFrame KeyTime="00:00:02.0" Value="66.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="100.1" EasingFunction="{StaticResource ProgressBarEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.8" Storyboard.TargetProperty="X" Storyboard.TargetName="R5TT">
                                                <LinearDoubleKeyFrame KeyTime="00:00:00.0" Value="0.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:00.5" Value="33.1" EasingFunction="{StaticResource ProgressBarEaseOut}"/>
                                                <LinearDoubleKeyFrame KeyTime="00:00:02.0" Value="66.1"/>
                                                <EasingDoubleKeyFrame KeyTime="00:00:02.5" Value="100.1" EasingFunction="{StaticResource ProgressBarEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="R1">
                                                <DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>
                                                <DiscreteDoubleKeyFrame KeyTime="00:00:02.5" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.2" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="R2">
                                                <DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>
                                                <DiscreteDoubleKeyFrame KeyTime="00:00:02.5" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.4" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="R3">
                                                <DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>
                                                <DiscreteDoubleKeyFrame KeyTime="00:00:02.5" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.6" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="R4">
                                                <DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>
                                                <DiscreteDoubleKeyFrame KeyTime="00:00:02.5" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00.8" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="R5">
                                                <DiscreteDoubleKeyFrame KeyTime="0" Value="1"/>
                                                <DiscreteDoubleKeyFrame KeyTime="00:00:02.5" Value="0"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid>
                                <Grid x:Name="DeterminateRoot" Visibility="Visible">
                                    <Rectangle x:Name="ProgressBarTrack" Height="4" />
                                    <Rectangle x:Name="ProgressBarIndicator" HorizontalAlignment="Left" Height="4" Fill="{TemplateBinding Foreground}" />
                                </Grid>
                                <Border x:Name="IndeterminateRoot" Visibility="Collapsed">
                                    <Grid HorizontalAlignment="Left">
                                        <Rectangle Fill="{TemplateBinding Foreground}" Height="4" IsHitTestVisible="False" Width="4" x:Name="R1" Opacity="0" CacheMode="BitmapCache">
                                            <Rectangle.RenderTransform>
                                                <TranslateTransform x:Name="R1TT"/>
                                            </Rectangle.RenderTransform>
                                        </Rectangle>
                                        <Rectangle Fill="{TemplateBinding Foreground}" Height="4" IsHitTestVisible="False" Width="4" x:Name="R2" Opacity="0" CacheMode="BitmapCache">
                                            <Rectangle.RenderTransform>
                                                <TranslateTransform x:Name="R2TT"/>
                                            </Rectangle.RenderTransform>
                                        </Rectangle>
                                        <Rectangle Fill="{TemplateBinding Foreground}" Height="4" IsHitTestVisible="False" Width="4" x:Name="R3" Opacity="0" CacheMode="BitmapCache">
                                            <Rectangle.RenderTransform>
                                                <TranslateTransform x:Name="R3TT"/>
                                            </Rectangle.RenderTransform>
                                        </Rectangle>
                                        <Rectangle Fill="{TemplateBinding Foreground}" Height="4" IsHitTestVisible="False" Width="4" x:Name="R4" Opacity="0" CacheMode="BitmapCache">
                                            <Rectangle.RenderTransform>
                                                <TranslateTransform x:Name="R4TT"/>
                                            </Rectangle.RenderTransform>
                                        </Rectangle>
                                        <Rectangle Fill="{TemplateBinding Foreground}" Height="4" IsHitTestVisible="False" Width="4" x:Name="R5" Opacity="0" CacheMode="BitmapCache">
                                            <Rectangle.RenderTransform>
                                                <TranslateTransform x:Name="R5TT"/>
                                            </Rectangle.RenderTransform>
                                        </Rectangle>
                                    </Grid>
                                </Border>
                            </Grid>
                        </unsupported:RelativeAnimatingContentControl>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </phone:PhoneApplicationPage.Resources>
    
    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <controls:Pivot Name="mainPivot" Foreground="#FF0097D5" UnloadedPivotItem="Pivot_UnloadedPivotItem" LoadedPivotItem="Pivot_LoadedPivotItem">
            <controls:Pivot.Title>
                <StackPanel Orientation="Horizontal">
                    <Image Source="/Tsina;component/Logo.png" Name="logoImage" Height="50" Width="50" />
                    <TextBlock VerticalAlignment="Bottom" FontSize="28">新浪微博</TextBlock>
                </StackPanel>
            </controls:Pivot.Title>
            <controls:Pivot.Background>
                <ImageBrush ImageSource="/Tsina;component/PanoramaBackground.png" Stretch="None" />
            </controls:Pivot.Background>

            <controls:PivotItem Name="tweetPivotItem">
                <controls:PivotItem.Header>
                    <TextBlock FontSize="50">
                        <Run Foreground="Firebrick" Text="读"/><Run Text="微博"/>
                    </TextBlock>
                </controls:PivotItem.Header>
                <ListBox Name="tweetsListBox" Margin="0,0,-12,0">
                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel />
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>

                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Margin="12,0,0,35" Loaded="Tweet_Loaded">
                                <Image VerticalAlignment="Top" HorizontalAlignment="Left" Source="{Binding Path=UserId, Converter={StaticResource UserImageConverter}}" Height="50" Width="50" />
                                <StackPanel Width="365" Margin="15,-7,0,0">
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="Auto" />
                                        </Grid.ColumnDefinitions>
                                        <TextBlock Grid.Column="0" Foreground="#FF333333" Text="{Binding Path=ScreenName}" TextWrapping="Wrap" FontSize="30" />
                                        <TextBlock Grid.Column="1" Foreground="#FF999999" Text="{Binding Path=CreatedTimeForShow}" HorizontalAlignment="Right" VerticalAlignment="Bottom" />
                                    </Grid>
                                    <TextBlock Foreground="#FF444444" TextWrapping="Wrap" Loaded="TweetText_Loaded" />
                                </StackPanel>
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </controls:PivotItem>

            <controls:PivotItem Name="writeTweetPivotItem">
                <controls:PivotItem.Header>
                    <TextBlock FontSize="50">
                        <Run Foreground="Firebrick" Text="写"/><Run Text="微博"/>
                    </TextBlock>
                </controls:PivotItem.Header>

                <StackPanel>
                    <TextBox Text="有什么新鲜事？" Foreground="#FF999999" HorizontalAlignment="Left" Name="tweetTextBox" VerticalAlignment="Top" Width="455" TextWrapping="Wrap" TextChanged="tweetTextBox_TextChanged" GotFocus="tweetTextBox_GotFocus" LostFocus="tweetTextBox_LostFocus">
                        <i:Interaction.Behaviors>
                            <local:IMEBehavior />
                        </i:Interaction.Behaviors>
                    </TextBox>
                    <TextBlock Foreground="#FF002060" TextWrapping="Wrap" Name="retweetTextBlock" />
                </StackPanel>
            </controls:PivotItem>

            <controls:PivotItem Name="searchPivotItem">
                <controls:PivotItem.Header>
                    <TextBlock FontSize="50">
                        <Run Text="话题"/>
                    </TextBlock>
                </controls:PivotItem.Header>
                <TextBox Text="想围观什么？" Foreground="#FF999999" HorizontalAlignment="Left" Name="searchTextBox" VerticalAlignment="Top" Width="455" />
            </controls:PivotItem>

            <controls:PivotItem Name="followPivotItem">
                <controls:PivotItem.Header>
                    <TextBlock FontSize="50">
                        <Run Text="关注"/>
                    </TextBlock>
                </controls:PivotItem.Header>
                <TextBox Text="想关注谁？" Foreground="#FF999999" HorizontalAlignment="Left" Name="followSearchTextBox" VerticalAlignment="Top" Width="455" />
            </controls:PivotItem>

        </controls:Pivot>

        <ProgressBar Height="4" VerticalAlignment="Bottom" IsIndeterminate="False" x:Name="loadingProgressBar" Style="{StaticResource CustomIndeterminateProgressBar}" />
    </Grid>

    <!--Sample code showing usage of ApplicationBar-->
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>